/* cl.ext.powerFloat 0.1*/
(
    function (factory) {
        if (typeof define === 'function' && define.amd) {
            define(['jquery',"PowerFloat"], factory);
        } else if (typeof module === 'object' && module.exports) {
            require('PowerFloat');
            module.exports = function( root, jQuery ) {
                if ( jQuery === undefined ) {
                    if ( typeof window !== 'undefined' ) {
                        jQuery = require('jquery');
                    }
                    else {
                        jQuery = require('jquery')(root);
                    }
                }
                factory(jQuery);
            };
        } else {
            factory(jQuery);
        }
    }(
    function ($){
        var defaultExtInfo={boxHtml:'<div style="display: none" class="powerfloat-box"></div>',boxid:"box_HoverFollow"};
        var defaults={
            type:"table",//type:table,imgselect,textlist;
            html:"",
            data:[],
            ajaxInfo:{url:"",type:"GET",para:{}},
            ajaxWholeCallback:null,
            tableTitle:[],
            isTdEllipsis:false
        };
        var $modalCommon={
            getDefaults :function () {
                return defaults
            },
            getOptions : function (elementData,options) {
                options=$.ExtCommon.isCheckEmpty(options)?{}:options;
                var optionBase =$.ExtCommon.initMergeJson(elementData,options);
                optionBase =$.ExtCommon.initMergeJson(this.getDefaults(),optionBase);
                return optionBase
            },
            getHtmlTable:function(list,options){
                var trCount=options.tableTitle.length;
                var htmlTitle=$.map(options.tableTitle,function(item){return "<th class='sorting_disabled "+(item.class?item.class:"")+"'>"+item.title+"</th>";}).join("");
                var $thead="<thead><tr>"+htmlTitle+"</tr></thead>";
                var htmlBody="";
                if(list.length>0){
                    htmlBody=$.map(list,function(item,j){
                        var tdsArr=[];
                        var rowData=options.tableRowCallback?options.tableRowCallback(item):{};
                        for(var i=0;i<trCount;i++){
                            var tdJson=options.tableTitle[i];
                            if(rowData.hasOwnProperty(tdJson.key)){
                                tdsArr.push(rowData[tdJson.key])
                            }else{
                                tdsArr.push(item[tdJson.key])
                            }
                        }
                        var trs=$.map(tdsArr,function (td) {
                            return "<td>"+td+"</td>";
                        }).join("");
                        return "<tr class='"+((j%2)>0?"even":"odd")+"'>"+trs+"</tr>";
                    }).join("");
                }else{
                    htmlBody='<tr class="odd"><td colspan="'+trCount+'" class="dataTables_empty">没有匹配结果</td></tr>'
                }
                var $tbody="<tbody>"+htmlBody+"</tbody>";
                var $table1='<div class="overflow-title"><table class="table table-bordered table-bordered-topbottom dataTable no-footer table-tighten bg-white w-400" width="100%">'+$thead+'<tbody></tbody></table></div>';
                var $table2='<div class="overflow-body"><table class="table table-bordered table-bordered-topbottom dataTable no-footer table-tighten bg-white w-400" width="100%">'+$thead+$tbody+'</table></div>';
                return $table1+$table2;
            },
            getHtmlImgSelect:function(list){
                var htmlLi=$.map(list,function(info){
                    info.hovertitle= $.ExtCommon.isCheckEmpty(info.hovertitle)?"":info.hovertitle;
                    return '<li>' +
                                '<a class="imgselect-btn" href="javascript:"  data-initValue="'+info.id+'" style="width:100px;height: 50px;" title="'+info.hovertitle+'"><img src="'+info.url+'"></a>' +
                                '<div class="imgselect-title imgselect-title-bottom" title="'+info.hovertitle+'">'+info.title+'</div>' +
                            '</li>';
                }).join("");
                return '<div class="panel-imgselect"><ul class="imgselect-list">'+htmlLi+'</ul></div><div class="clear"></div>';
            },
            getHtmlTextList:function(list){
                var htmlSpan=$.map(list,function(info){return '<span>'+info.name+'</span>';}).join("");
                return '<div class="panel-span-list">'+htmlSpan+'</div>';
            },
            getHtmlLoad:function () {
                return '<div class="w-200 text-center m-10"><i class="fa fa-refresh fa-spin fa-lg fa-fw margin-bottom"></i></div>'
            }
        };
        var PowerFloatExtModal = function(element, options) {
            var self=this;
            self.element = $(element);
            self.optionBase=$modalCommon.getOptions(self.element.data(),options);
            self.elementBox=$("#"+defaultExtInfo.boxid);
            if(self.elementBox.length===0){
                self.elementBox=$(defaultExtInfo.boxHtml).attr("id",defaultExtInfo.boxid).appendTo("body");
            }
            self.element.powerFloat({reverseSharp: true, targetMode:"customHtml", target: self.elementBox,position:"7-5",
                loadCallback:function (cb) {
                    self.bindShowHtml();
                    if(cb)cb()
                },
                showBeforeCallback:function(cb){
                    setTimeout(function () {
                        if(!$.ExtCommon.isCheckEmpty(self.optionBase.html)){
                            self.bindBoxHtml(self.optionBase.html,cb)
                        }else if(!$.ExtCommon.isCheckEmpty(self.optionBase.data)){
                            self.bindBoxData(self.optionBase.data,cb)
                        }else if(!$.ExtCommon.isCheckEmpty(self.optionBase.ajaxInfo.url)){
                            self.bindBoxAjax(self.optionBase.ajaxInfo,cb)
                        }else if(!$.ExtCommon.isCheckEmpty(self.optionBase.ajaxWholeCallback)){
                            self.optionBase.ajaxWholeCallback();
                            self.ajaxWholeDataCallback =cb;
                        }
                    },500);
                }
            });
        };
        PowerFloatExtModal.prototype = {
            ajaxWholeData:function(data){
                this.optionBase.data=data;
                this.bindBoxData(this.optionBase.data,this.ajaxWholeDataCallback);
            },
            bindShowHtml:function () {
                this.elementBox.html($modalCommon.getHtmlLoad()).show();
            },
            bindBoxHtml:function(str){
                this.elementBox.html(str)
            },
            bindBoxData:function(list,cb){
                var self=this;
                var type=self.optionBase.type.toLowerCase();
                var html="";
                switch(type){
                    case "table":
                        html=$modalCommon.getHtmlTable(list,self.optionBase);
                        self.elementBox.html(html).addClass("table-panel-overflow");
                        setTimeout(function(){
                            var h=self.elementBox.find(".overflow-title").height();
                            var obj=self.elementBox.find(".overflow-body .table");
                            var style=obj.attr("style");
                            var styleSp=$.ExtCommon.isCheckEmpty(style)?"":style+(style.substr(style.length-1)===";"?"":";");
                            style=styleSp+("margin-top:-"+h+"px !important;");
                            obj.attr("style",style);
                        },10);
                        break;
                    case "imgselect":
                        var elementParent=self.elementBox.parent();
                        var elementPrev=self.elementBox.prev("div[id^='floatBox_']");
                        if(!elementParent.is("body")){
                            elementParent.css({left:0,top:0});
                        }else if (elementPrev.length>0){
                            elementPrev.css({left:0,top:0});
                        }
                        list= $.ExtCommon.convertListByPara(list,{"title":"name"});
                        html=$modalCommon.getHtmlImgSelect(list);
                        self.elementBox.html(html);
                        break;
                    case "textlist":
                        html=$modalCommon.getHtmlTextList(list);
                        self.elementBox.html(html);
                        break;
                }
                if(cb)cb()
            },
            bindBoxAjax:function(json,cb){
                var self=this;
                $.ExtAjax.initGet({
                    url: json.url, data: json.para,
                    //infoLoad:{place:"box",boxId:"#chart_home",height:400,type:"circle",dataListName:"list"},
                    successCallback: function (result) {
                        if(result.success){
                            self.optionBase.data=result.data;
                            self.bindBoxData(self.optionBase.data,cb)
                        }else{
                            $.ExtNotify.error(result.msg);
                        }
                    }
                });
            }
        };
        $.fn.ExtPowerFloat = function(options) {
            var dataFun;
            this.each(function() {
                var el = $(this);
                var tempData=el.data('ExtPowerFloat');
                if (tempData) {
                    if (typeof  options === "string") {
                        if (tempData[options]) {
                            dataFun =tempData[options]()
                        } else {
                            dataFun = tempData
                        }
                    } else {
                        dataFun = tempData
                    }
                } else {
                    dataFun = new PowerFloatExtModal(el, options);
                    el.data('ExtPowerFloat', dataFun);
                }
            });
            return dataFun;
        };
        return PowerFloatExtModal;
    })
);
